<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Lumino - Dashboard</title>
<style>
	table.basetable td{
		text-align:center;
		font-size:12px;
		color:#FFFFFF;
		padding-bottom:3px;
		padding-top:3px
		}
	tr.basehead td{
	text-align: center;
	font-size: 14px;
	color: #FFFFFF
		}
	 tbody tr:nth-child(odd) {  
            background-color: #1E2A4C /* green, 10% alpha */  
        }  
        tbody tr:nth-child(even) {  
            background-color: #142540 /* red, 30% alpha */  
        }  
	a.basea hover{
		color:#FFFFFF;
		text-decoration:none;
		}
		
		.head-menu a:link{
			color:#FFF;
			text-decoration:none;
			}
			.head-menu a:active{
			color:#FFF;
			text-decoration:none;
			}
			.head-menu a:hover{
			color:#FFF;
			text-decoration:none;
			}
			
			.head-menu a:visited{
			color:#FFF;
			text-decoration:none;
			}
</style>
<style type="text/css">  
    .tree {margin: 0;padding: 0;background-color:#f2f2f2;overflow: hidden;}  
    /*隐藏input*/
    .tree li input{position: absolute;left: 0;opacity: 0;z-index: 2;cursor: pointer;height: 1em;width:1em;top: 0;}  
    /*所有菜单项设置统一样式*/
    .tree li {position: relative;list-style: none;}   
    /*一级菜单加下边线*/
    .tree>li{border-bottom: 1px solid #d9d9d9;}
    /*给有子菜单的菜单项添加背景图标*/
    .tree li label {max-width:999px;cursor: pointer;display: block;margin:0 0 0 -50px;padding: 15px 10px 15px 70px;background: url(../../images/cp-detail-arrow-b.png) no-repeat right center;background-position:95% 50%;white-space:nowrap;overflow:hidden;text-overflow: ellipsis; }  
    .tree li label:hover,li label:focus{background-color:#a7a7a7;color:#fff;}
    /*清除所有展开的子菜单的display*/
    .tree li input + ol{display: none;}  
    /*当input被选中时，给所有展开的子菜单设置样式*/
    .tree input:checked + ol {padding-left:14px;height: auto;display: block;}  
    .tree input:checked + ol > li { height: auto;}  
    /*末层菜单为A标签，设置样式*/
    .tree li.file a{margin:0 -10px 0 -50px;padding: 15px 20px 15px 70px;text-decoration:none;display: block;color:#000;white-space:nowrap;overflow:hidden;text-overflow: ellipsis;} 
    .tree li.file a:hover,li.file a:focus{background-color:#a7a7a7;color:#fff;} 
    /*不同层级的菜单字体大小不同*/
    .tree .folderOne{font-size: 14px;color:#000}
    .tree .folderTwo{font-size:12px;color:#000}
    .tree .folderThree{font-size:10px;color:#000}
</style>
<script type="text/javascript">
       $(document).ready(function() {
           //每个有子菜单的菜单项添加点击事件
           $(".tree label").click(function(){
               //获取当前菜单旁边input的check状态
               var isChecked = $(this).next("input[type='checkbox']").is(':checked');
               //展开和收齐的不同状态下更换右侧小图标
               if(isChecked){
                   $(this).css(
                       "background-image","url(../images/cp-detail-arrow-b.png)"
                   );
               }else{
                   $(this).css(
                       "background-image","url(../images/cp-detail-arrow-t.png)"
                   );
               }
           });
            
       });
   </script>


<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/datepicker3.css" rel="stylesheet">
<link href="css/styles.css" rel="stylesheet">

<!--[if lt IE 9]>
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->

</head>

<body style="background:#DFDCDC">
	<nav style="background-color:#142C51" class="navbar navbar-inverse navbar-fixed-top" role="navigation">
		<div class="container-fluid">
			<div class="navbar-header">
            <img src="img/logo.png" alt="LOGO" style="height:75px; padding:3px 15px 3px;">
            <font size="6" color="white" face="Microsoft YaHei" style="vertical-align: middle;">面向高端制造领域的大数据管理系统</font>

				<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#sidebar-collapse">
					<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				</button>
				<!--<a class="navbar-brand" href="#"><span>Lumino</span>Admin</a>-->
                <table style="margin-top: 28px;float: right">
	                <tr class="headback">
        	        	<td   bgcolor="#142C51" style="border:hidden;border-right: solid;border-right-color: #797979;padding: 0 10px 0 10px;"><font class="head-menu" color="#FFFFFF" size="3px" ><a href="index.html">首页</a></font></td>
    	                <td bgcolor="#142C51" style="border-right: solid;border-right-color: #797979;padding: 0 10px 0 10px;"><font color="#FFFFFF" size="5px" class="head-menu"><a href="datasource_1.html">数据源管理</a></font></td>
	                    <td bgcolor="#142C51" style="border-right: solid;border-right-color: #797979;padding: 0 10px 0 10px;"><font color="#FFFFFF" size="3px" class="head-menu"><a href="igenginemain.html">一体化管理引擎</a></font></td>
                    	<td bgcolor="#142C51"><font color="#FFFFFF" style="padding: 0 10px 0 10px;" size="3px" class="head-menu"><a href="operation.html">运维工具</a></font></td>
    	            </tr>
                </table>
			</div>
		</div><!-- /.container-fluid -->
	</nav>
   
	<div style="background:#f2f2f2;position:absolute;top:75px;width:10%;bottom:0px">
    	<div style="position:relative;margin-top:40px;overflow:hidden;text-overflow: ellipsis;white-space:nowrap;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="img/全部2.png" style="width:25px;height:25px">&nbsp;&nbsp;<font size="3px" color="#000">数据源概览</font></div>
        <div style="position:relative;margin-top:20px;overflow:hidden;text-overflow: ellipsis;white-space:nowrap;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="img/加.png" style="width:18px;height:18px">&nbsp;&nbsp;<font size="3px" color="#000">添加数据源</font></div>
        <div style="position:relative;margin-top:20px;margin-bottom:30px;margin-left:5%;margin-right:5%;height:3px;background:#000000"></div>
        
    	<ol class="tree">  
       <li>  
           <label for="folder1" class="folderOne"><img src="img/时间.png" style="width:16px;height:16px" />&nbsp;时序数据源管理</label> <input type="checkbox" id="folder1" /> 
           <ol>  
                <li>  
                   <label for="subfolder1" class="folderTwo"><img src="img/数据库.png" style="width:16px;height:16px"/>&nbsp;时序数据源实例1</label> <input type="checkbox" id="subfolder1"  />   
                   <ol>   <li class="file folderThree"><a href="#"><img src="img/眼睛.png" style="width:16px;height:16px"/>&nbsp;系统概览</a></li> 
                   		<li><label for="subfolder11" class="folderTwo"><img src="img/元数据面板.png" style="width:16px;height:16px"/>&nbsp;元数据管理</label> <input type="checkbox" id="subfolder11"  /> 
                        <ol>
                         <li class="file folderThree"><a href="#"><img src="img/group.png" style="width:16px;height:16px"/>&nbsp;存储组</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/折线图.png" style="width:16px;height:16px"/>&nbsp;时间序列</a></li> 

                        </ol></li>
                       <li class="file folderThree"><a href="#"><img src="img/search.png" style="width:16px;height:16px"/>&nbsp;数据查询</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/控制台.png" style="width:16px;height:16px"/>&nbsp;控制台</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/fire.png" style="width:16px;height:16px"/>&nbsp;Grafana</a></li>  
                   </ol>  
               </li> 
               <li>  
                   <label for="subfolder2" class="folderTwo"><img src="img/数据库.png" style="width:16px;height:16px"/>&nbsp;时序数据源实例2</label> <input type="checkbox" id="subfolder2"  />   
                   <ol> <li class="file folderThree"><a href="#"><img src="img/眼睛.png" style="width:16px;height:16px"/>&nbsp;系统概览</a></li>  
                   		<li><label for="subfolder21" class="folderTwo"><img src="img/元数据面板.png" style="width:16px;height:16px"/>&nbsp;元数据管理</label> <input type="checkbox" id="subfolder21"  /> 
                        <ol>
                         <li class="file folderThree"><a href="#"><img src="img/group.png" style="width:16px;height:16px"/>&nbsp;存储组</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/折线图.png" style="width:16px;height:16px"/>&nbsp;时间序列</a></li>  

                        </ol></li>
                       <li class="file folderThree"><a href="#"><img src="img/search.png" style="width:16px;height:16px"/>&nbsp;数据查询</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/控制台.png" style="width:16px;height:16px"/>&nbsp;控制台</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/fire.png" style="width:16px;height:16px"/>&nbsp;Grafana</a></li>  
                   </ol>   
               </li>
           </ol>  
       </li> 
       
        
       <li>  
       
           <label for="folder2" class="folderOne" ><img src="img/公共-星号.png" style="width:16px;height:16px" />&nbsp;图数据源管理</label> <input type="checkbox" id="folder2" />   
           <ol>  
                <li>  
                   <label for="subfolder3" class="folderTwo"><img src="img/数据库.png" style="width:16px;height:16px"/>&nbsp;图数据源实例1</label> <input type="checkbox" id="subfolder3"  />   
                   <ol>  
                   <li class="file folderThree"><a href="#"><img src="img/眼睛.png" style="width:16px;height:16px"/>&nbsp;系统概览</a></li> 
                   <li>
                   		<label for="subfolder31" class="folderTwo"><img src="img/元数据面板.png" style="width:16px;height:16px"/>&nbsp;元数据管理</label> <input type="checkbox" id="subfolder31"  /> 
                        <ol>
                         <li class="file folderThree"><a href="#"><img src="img/label.png" style="width:16px;height:16px"/>&nbsp;标签信息</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/nodejs.png" style="width:16px;height:16px"/>&nbsp;节点信息</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/chart-relation.png" style="width:16px;height:16px"/>&nbsp;关系信息</a></li> 

                        </ol></li>
                       <li>
                   		<label for="subfolder32" class="folderTwo"><img src="img/search.png" style="width:16px;height:16px"/>&nbsp;数据查询</label> <input type="checkbox" id="subfolder32"  /> 
                        <ol>
                         <li class="file folderThree"><a href="#"><img src="img/结构.png" style="width:16px;height:16px"/>&nbsp;产品结构</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/使用范围广.png" style="width:16px;height:16px"/>&nbsp;零件使用情况</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/compare.png" style="width:16px;height:16px"/>&nbsp;结构异同</a></li> 
                       <li class="file folderThree"><a href="#"><img src="img/物料管理.png" style="width:16px;height:16px"/>&nbsp;物料总数</a></li>

                        </ol></li>  
                   </ol>  
               </li> 
               <li>  
                   <label for="subfolder4" class="folderTwo"><img src="img/数据库.png" style="width:16px;height:16px"/>&nbsp;图数据源实例2</label> <input type="checkbox" id="subfolder4"  />   
                   <ol>  
                   <li class="file folderThree"><a href="#"><img src="img/眼睛.png" style="width:16px;height:16px"/>&nbsp;系统概览</a></li> 
                   <li>
                   		<label for="subfolder41" class="folderTwo"><img src="img/元数据面板.png" style="width:16px;height:16px"/>&nbsp;元数据管理</label> <input type="checkbox" id="subfolder41"  /> 
                        <ol>
                         <li class="file folderThree"><a href="#"><img src="img/label.png" style="width:16px;height:16px"/>&nbsp;标签信息</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/nodejs.png" style="width:16px;height:16px"/>&nbsp;节点信息</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/chart-relation.png" style="width:16px;height:16px"/>&nbsp;关系信息</a></li> 

                        </ol></li>
                       <li>
                   		<label for="subfolder42" class="folderTwo"><img src="img/search.png" style="width:16px;height:16px"/>&nbsp;数据查询</label> <input type="checkbox" id="subfolder42"  /> 
                        <ol>
                         <li class="file folderThree"><a href="#"><img src="img/结构.png" style="width:16px;height:16px"/>&nbsp;产品结构</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/使用范围广.png" style="width:16px;height:16px"/>&nbsp;零件使用情况</a></li>  
                       <li class="file folderThree"><a href="#"><img src="img/compare.png" style="width:16px;height:16px"/>&nbsp;结构异同</a></li> 
                       <li class="file folderThree"><a href="#"><img src="img/物料管理.png" style="width:16px;height:16px"/>&nbsp;物料总数</a></li>

                        </ol></li>  
                   </ol>  
               </li> 
           </ol>  
       </li> 
       <li>  
           <label for="folder3"  class="folderOne"><img src="img/file.png" style="width:16px;height:16px"/>&nbsp;非结构化数据源</label> <input type="checkbox" id="folder3" />   
           <ol>  
                <li>  
                   <label for="subfolder3t" class="folderTwo"><img src="img/数据库.png" style="width:16px;height:16px"/>&nbsp;非结构化数据源实例1</label> <input type="checkbox" id="subfolder3t"  />   
                   <ol>  
                   <li class="file folderThree"><a href="#"><img src="img/眼睛.png" style="width:16px;height:16px"/>&nbsp;系统概览</a></li> 
                   <li class="file folderThree"><a href="#"><img src="img/元数据面板.png" style="width:16px;height:16px"/>&nbsp;元数据管理</a></li>
                   <li class="file folderThree"><a href="#"><img src="img/search.png" style="width:16px;height:16px"/>&nbsp;数据查询</a></li>
                   
                   </ol>  
       </li> </ol></li>
       <li>  
           <label for="folder4"  class="folderOne"><img src="img/关系数据库.png" style="width:16px;height:16px"/>&nbsp;关系数据源</label> <input type="checkbox" id="folder4"/>   
            <ol>  
                <li>  
                   <label for="subfolder4r" class="folderTwo"><img src="img/数据库.png" style="width:16px;height:16px"/>&nbsp;关系数据源实例1</label> <input type="checkbox" id="subfolder4r"  />   
                   <ol>  
                   <li class="file folderThree"><a href="#"><img src="img/控制台.png" style="width:16px;height:16px"/>&nbsp;控制台</a></li> 
           </ol>
       </li> </ol>  
       </li> 
       <li>  
           <label for="folder5"  class="folderOne"><img src="img/列表.png" style="width:16px;height:16px"/>&nbsp;键值数据源</label> <input type="checkbox" id="folder5"/>   
            <ol>  
                <li>  
                   <label for="subfolder5k" class="folderTwo"><img src="img/数据库.png" style="width:16px;height:16px"/>&nbsp;键值数据源实例1</label> <input type="checkbox" id="subfolder5k"/>   
                   <ol>  
                   <li class="file folderThree"><a href="#"><img src="img/控制台.png" style="width:16px;height:16px"/>&nbsp;控制台</a></li> 
           </ol>
       </li> </ol>  
       </li>  
   </ol>
    </div>
    <div style="background:#DFDCDC;position:absolute;left:10%;width:90%">
    </div>
	
	<script src="js/jquery-1.11.1.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script src="js/chart.min.js"></script>
	<script src="js/chart-data.js"></script>
	<script src="js/easypiechart.js"></script>
	<script src="js/easypiechart-data.js"></script>
	<script src="js/bootstrap-datepicker.js"></script>
	<script>
		$('#calendar').datepicker({
		});

		!function ($) {
		    $(document).on("click","ul.nav li.parent > a > span.icon", function(){          
		        $(this).find('em:first').toggleClass("glyphicon-minus");      
		    }); 
		    $(".sidebar span.icon").find('em:first').addClass("glyphicon-plus");
		}(window.jQuery);

		$(window).on('resize', function () {
		  if ($(window).width() > 768) $('#sidebar-collapse').collapse('show')
		})
		$(window).on('resize', function () {
		  if ($(window).width() <= 767) $('#sidebar-collapse').collapse('hide')
		})
	</script>	
</body>

</html>
